<template>
    <div class="jinianguan">
        <van-nav-bar
		:title="data.username + '纪念馆信息'"
		left-arrow
		@click-left="onClickLeft"
		/>
        <div class="block" style="margin-top: 50px;border-bottom: 2px solid #31a2c8;margin: 50px 20px 20px 20px;padding-bottom: 20px;">
            <img :src="data.picurlofdeath">
            <div class="b_right block">
                <span v-if="data.gender == 0">{{data.username}} 男士</span>
                <span v-else>{{data.username}} 女士</span>
                <span>生于 {{data.borndate}}</span>
                <span>死于 {{data.deathdate}}</span>
                <span>享年 {{data.liveage}} 岁</span>
                <span>{{data.area}}</span>
                <span>{{data.national}}</span>
                <span>从事{{data.job}}</span>
                <span>死于{{data.reasonofdeath}}</span>
            </div>
        </div>
        <van-tag mark type="primary">逝者遗照</van-tag>
        <div class="block" style="padding: 20px;">
            <img :src="data.picurlofdeath" style="width: 100%;">
        </div>
        <van-tag mark type="primary">生平简介</van-tag>
        <div class="word">
            {{data.livemsg}}
        </div>
        <van-tag mark type="primary">墓志铭</van-tag>
        <div class="word">
           {{data.epitaph}}
        </div>
        <van-tag mark type="primary">吊唁日程</van-tag>
        <div class="word">
            {{data.condolencesdate}}
        </div>
        <van-tag mark type="primary">生前相册</van-tag>
        <div class="photo">
            <img v-for="item in pic0Data" :src="item" :key="item">
        </div>
        <van-tag mark type="primary">生前视频</van-tag>
        <div class="photo">
            <video controls="controls" style="width: 90%;"></video>
        </div>
        <van-tag mark type="primary">吊唁相册</van-tag>
        <div class="photo">
            <img v-for="item in pic1Data" :src="item" :key="item">
        </div>
        <van-tag mark type="primary">吊唁视频</van-tag>
        <div class="photo">
            <video controls="controls" style="width: 90%;"></video>
        </div>
        <van-tag mark type="primary">祭奠相册</van-tag>
        <div class="photo">
            <img v-for="item in pic2Data" :src="item" :key="item">
        </div>
        <van-tag mark type="primary">祭奠视频</van-tag>
        <div class="photo">
            <video controls="controls" style="width: 90%;"></video>
        </div>
        <van-tag mark type="primary">直播视频</van-tag>
        <div class="photo">
            <video controls="controls" style="width: 90%;"></video>
        </div>
        <van-button size="large" @click="look">查看馆</van-button>
    </div>
</template>

<script>
export default {
    data () {
        return {
            data: {},
            pic0Data:[],
            pic1Data:[],
            pic2Data:[],
            mid:''
        }
    },
    created () {
        this.data = JSON.parse(window.localStorage.getItem('item'))
        this.mid = this.data.id
        this.getData()
        this.getData1()
        this.getData2()
    },
    methods: {
        onClickLeft () {
            this.$router.go(-1)
        },
        look () {
            this.$router.push('/building-edit')
        },
        getData () {
            var that = this
            this.$axios.get("/huainianwang/picInfo/app/getPicList?mid="+this.mid+"&pictype=0")
            .then(function(res){
                that.pic0Data = res.data.object.picurl.split(',')
                // console.log(that.pic0Data)
            },function(err){
            }).catch(function(error){
            });    
        },
        getData1 () {
            var that = this
            this.$axios.get("/huainianwang/picInfo/app/getPicList?mid="+this.mid+"&pictype=1")
            .then(function(res){
                    that.pic1Data = res.data.object.picurl.split(',')
            },function(err){
            }).catch(function(error){
            });    
        },
        getData2 () {
            var that = this
            this.$axios.get("/huainianwang/picInfo/app/getPicList?mid="+this.mid+"&pictype=2")
            .then(function(res){
                    that.pic2Data = res.data.object.picurl.split(',')
            },function(err){
            }).catch(function(error){
            });    
        },
    }
}
</script>

<style lang="scss" scoped>
.block {
    // display: flex;
    img {
        width: 80%;
        height: 140px;
        border-radius: 4px;
        margin-top: 20px;
        margin-right: 10px;
    }
    .b_right{
        font-size: 12px;
        color: #4d4d4d;
        display: block;
        span{
            display: block;
            line-height: 20px;
        }
        span:nth-child(1) {
            font-size: 20px;
            color: #000;
            line-height: 40px;
        }
    }
}
.photo{
    padding: 20px;
    img{
        width: 90%;
        height: 140px;
        margin-right: 10%;
        margin-bottom: 20px;
    }
}
.word {
    padding: 20px;
    font-size: 12px;
    line-height: 20px;
    color: #4d4d4d;
    text-indent: 20px;
}
</style>
<style>
.jinianguan .van-tag{
    background: #31a2c8 !important;
}
</style>

